<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!-- <link rel="icon" href="../favicon.ico" type="image/x-icon"> -->
    <link rel="shortcut icon" href="../img/favicon.ico" type="image/x-icon">
    <title>鲜花APP -- 购物车</title>
    <link rel="stylesheet" href="../css/icon.css">
    <link rel="stylesheet" href="../css/normalize.css">
    <link rel="stylesheet" href="../css/public.css">
    <link rel="stylesheet" href="../css/shopcar.css">
    <script src="../js/rem.js"></script>
    <script src="../js/jq.v1.7.js"></script>
    <script src="../js/shopcar.js"></script>
</head>

<body>
    <!-- 部分页面的公共样式 顶部菜单栏 开始 -->
    <div class="topbar">购物车</div>
    <!-- 部分页面的公共样式 顶部菜单栏 结束 -->

    <!-- 单独样式 订单列表 开始 -->
    <div class="pro-js">
        <div class="pro-item">
            <div class="pro-left">
                <i class="iconfont icon-check1"></i>
            </div>
            <div class="pro-img"></div>
            <div class="pro-right">
                <p>【心之和蛋糕】宇治抹茶红豆coc【心之和蛋糕】宇治</p>
                <p class="more">
                    <span class="price">￥<span>300</span></span>
                    <span class="input">
                        <i class="iconfont icon-weibiaoti-6 add"></i>
                        <span class="num">1</span>
                    <i class="iconfont icon-jianshao subtract"></i>
                    </span>
                    <span class="delete">删除</span>
                </p>
            </div>
        </div>
        <div class="pro-item">
            <div class="pro-left">
                <i class="iconfont icon-check1"></i>
            </div>
            <div class="pro-img"></div>
            <div class="pro-right">
                <p>【心之和蛋糕】宇治抹茶红豆coc【心之和蛋糕】宇治</p>
                <p class="more">
                    <span class="price">￥<span>200</span></span>
                    <span class="input">
                        <i class="iconfont icon-weibiaoti-6 add"></i>
                        <span class="num">1</span>
                    <i class="iconfont icon-jianshao subtract"></i>
                    </span>
                    <span class="delete">删除</span>
                </p>
            </div>
        </div>
        <div class="pro-item active">
            <div class="pro-left">
                <i class="iconfont icon-check1"></i>
            </div>
            <div class="pro-img"></div>
            <div class="pro-right">
                <p>【心之和蛋糕】宇治抹茶红豆coc【心之和蛋糕】宇治</p>
                <p class="more">
                    <span class="price">￥<span>100</span></span>
                    <span class="input">
                        <i class="iconfont icon-weibiaoti-6 add"></i>
                        <span class="num">1</span>
                    <i class="iconfont icon-jianshao subtract"></i>
                    </span>
                    <span class="delete">删除</span>
                </p>
            </div>
        </div>
    </div>
    <!-- 单独样式 订单列表 结束 -->
    <!-- 推荐购买模块 开始 -->
    <div class="pro-more">
        <p class="tip">购买该商品的还购买了</p>
        <div class="pro-more-list">
            <ul>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
                <li>
                    <div class="pro-more-img"></div>
                    <p class="pro-more-name">永生花带灯</p>
                    <p class="pro-more-price">￥388</p>
                </li>
            </ul>
        </div>
    </div>
    <!-- 推荐购买模块 结束 -->

    <!-- 结算模块 开始 -->
    <div class="pro-account">
        <div class="account-text">合计：<span class="account-total">￥1999</span></div>
        <div class="account-btn"><a href="">去结算</a></div>
    </div>
    <!-- 结算模块 开始 -->

    <!-- 公共样式 底部tabBar 开始 -->
    <div class="tabbar">
        <div class="tabbar-item">
            <i class="iconfont icon-danseshixintubiao-"></i>
            <p>首页</p>
        </div>
        <div class="tabbar-item">
            <i class="iconfont icon-sousuofenleigengduo"></i>
            <p>分类</p>
        </div>
        <div class="tabbar-item active">
            <i class="iconfont icon-B"></i>
            <p>购物车</p>
        </div>
        <div class="tabbar-item">
            <i class="iconfont icon-wode"></i>
            <p>我的</p>
        </div>
    </div>
    <!-- 公共样式 底部tabBar 结束 -->
</body>

</html>